<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

<title>GMWK Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="author" content="Gomedia"/>

<!-- ============ Styles ============ -->

<link rel="stylesheet" href="css/reset.css" media="screen" lang="en"/>
<link rel="stylesheet" href="css/gmwk.css" media="screen" lang="en"/>
<link rel="stylesheet" href="css/global.css" media="screen" lang="en"/>
<link rel="stylesheet" href="css/font.css" media="screen" lang="en"/>
  
</head>
<body>

<!-- ============ Stage ============ -->

<!-- Stage -->
<div class="global_canvas">
    
    <!-- main content gets loaded here -->
    <div class="global_leftbar">
        <a href="http://www.gomedia.co.za" target="_blank" title="Go Media website">Go Media</a>
        <span class="font_bold">Libraries</span>
        <a href="http://jquery.com" target="_blank" title="JQuery website">jQuery</a>
        <a href="https://github.com/pure/pure" target="_blank" title="Pure website">Pure Templating</a>
        <a href="http://benalman.com/" target="_blank" title="BBQ website">BBQ</a>
        <span class="font_bold">GMWK</span>
        <a href="http://gmwk.googlecode.com" target="_blank" title="Google Code">Google Code</a>
        <a href="http://gmwk.gomedia.co.za/doc" target="_blank" title="Documentation">Documentation</a>
    </div>
    
    <div class="global_loaded_content">
        <div id="gmwk_stage"></div>
    </div>
    
    <div class="global_rightbar QOTD_container"></div>
    
    <div class="global_footer">
        &copy; 
        <a href="http://www.gomedia.co.za">Go Media</a>
        2011
    </div>
    
</div>

<!-- ============ Template Cache ============ -->

<div id="gmwk_templates">

<!-- Login -->
<div class="gmwk_template_Login">
    <div class="global_hide Login_form">
        <div class="global_title">Login</div>
        <div class="global_content">
            <span class="global_Login_label">Username</span><input class="global_Login_input" type="text"/>
            <span class="global_Login_label">Password</span><input class="global_Login_input" type="text"/>
            <span class="global_Login_label"></span><input class="global_Login_input Login_login" type="button" value="Login"/>
        </div>
    </div>
</div>

<!-- Dashboard -->
<div class="gmwk_template_Dashboard">
    <div class="global_menu Dashboard_menu">
        <a class="Dashboard_menu_item Dashboard_Contact" href="#l=Dashboard&p=Contact">Contacts</a>
        <a class="Dashboard_menu_item" href="#l=Login&a=logout">Logout</a>
        <img class="global_hide global_loader Dashboard_loader" src="img/loader.gif">
    </div>
    <div class="Dashboard_content"></div>
    <div class="global_Dashboard_landing Dashboard_landing">
        Click the contacts link above!
    </div>
</div>

<!-- Contact -->
<div class="gmwk_template_Contact">
    <div class="global_submenu Contact_menu">
        <span>
          <a class="Contact_menu_item Contact_list" href="#l=Dashboard&p=Contact&a=list">List</a>
        </span>
        <span>|</span>
        <span>
          <a class="Contact_menu_item Contact_add" href="#l=Dashboard&p=Contact&a=add">Add</a>
        </span>
    </div>
    <div class="global_content">
    
        <div class="global_hide Contact_list Contact_template">
            <div class="Contact_list_template">
              <div class="global_Contact_list_header">
                  <span class="global_Contact_list_cell global_Contact_100 font_bold">Name</span>
                  <span class="global_Contact_list_cell global_Contact_200 font_bold">Surname</span>
              </div>
              <div class="global_Contact_list_row Contact_list_row">
                  <span class="global_hide Contact_nCID"></span>
                  <span class="global_Contact_list_cell global_Contact_100 Contact_sName"></span>
                  <span class="global_Contact_list_cell global_Contact_200 Contact_sLastName"></span>
                  <a class="global_Contact_list_link Contact_delete">delete</a>
              </div>
            </div>
        </div>
        
		
        <div class="global_hide Contact_form Contact_template">
            <div class="Contact_form_template">
                <form>
                    <input name="nCID" class="Contact_nCID" type="hidden" value="0"/>
                    <span class="global_Contact_form_label">Name</span>
                    <input name="sName" class="global_Contact_form_input Contact_sName" type="text" value=""/>
                    <span class="global_Contact_form_label">Surname</span>
                    <input name="sLastName" class="global_Contact_form_input Contact_sLastName" type="text" value=""/>
                    <span class="global_Contact_form_label">&nbsp;</span>
                    <a class="global_Contact_form_link Contact_save" href="javascript:;">Save</a>
                    <a class="global_Contact_form_link" href="#l=Dashboard&p=Contact&a=list">Cancel</a>
                </form>
            </div>
        </div>
      
    </div>
</div>

<!-- QOTD -->
<div class="gmwk_template_QOTD">
    <div class="QOTD_list">
        <div class="font_bold">Random quotes of the day</div><br/>
        <div class="QOTD_list_template">
            <div class="global_QOTD_item QOTD_item">
                <span class="global_QOTD_quote font_italic QOTD_sQuote">empty</span>
                <span class="global_QOTD_author">
                     --&nbsp;<span class="QOTD_sAuthor">empty</span>
                </span>
            </div>
        </div>
    </div>
</div>

</div>

<!-- ============ Script ============ -->

<!-- Libraries -->
<script type="text/javascript" src="js/lib/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/lib/jquery/bbq-1.2.1.min.js"></script>
<script type="text/javascript" src="js/lib/pure/pure_packed.js"></script>
<script type="text/javascript" src="js/lib/json2.js"></script>

<!-- Application core -->
<script type="text/javascript" src="js/core/gmwk.js"></script>
<script type="text/javascript" src="js/core/utils.js"></script>
<!-- Configure and bootstrap -->
<script type="text/javascript" src="js/config.js"></script>

<!-- Classes -->
<script type="text/javascript" src="js/classes/API.js"></script>
<script type="text/javascript" src="js/classes/Router.js"></script>
<script type="text/javascript" src="js/classes/QOTD.js"></script>
<script type="text/javascript" src="js/classes/Dashboard.js"></script>
<script type="text/javascript" src="js/classes/Contact.js"></script>
<script type="text/javascript" src="js/classes/Login.js"></script>

</body>
</html>

